<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
    <style>
        *{
            margin: 0px;
            padding: 0px;
            list-style: none;
            text-decoration: none;
        }
        .a{
            height: 497px;
            background: url('images/bg.jpg') repeat-x;
        }
        .b{
            height: 378px;
            width: 968px;
            margin:48px auto 27px;
        }
        .c{
            height: 50px;
            width: 968px;
            margin:0px auto;
            border-top: 1px solid black;
        }
        .a1{
            height: 74px;
            width: 928px;
            margin:0px auto;
        }
        .a .a2{
            height: 44px;
            width: 129px;
            margin: 14px 0px 14px;
            float: left;
        }
        .a .a3{
            float: left;
            margin: 30px 21px 27px 93px;
            color: white;
            font-size: 14px;
        }
        .a .a4{
            float: left;
            margin: 30px 0px 27px;
            color: white;
            font-size: 14px;
        }
        .a .a5{
            float: left;
            margin: 30px 21px 27px;
            color: white;
            font-size: 14px;;
        }
        .a .a6{
            float: left;
            margin: 30px 0px 27px;
            color: white;
            font-size: 14px;;
        }
        .a .a7{
            float: left;
            margin: 30px 21px 27px;
            color: white;
            font-size: 14px;;
        }
        .a .a8{
            float: left;
            margin: 30px 0px 27px;
            color: white;
            font-size: 14px;;
        }
        .a .a9{
            float: left;
            margin: 30px 21px 27px;
            color: white;
            font-size: 14px;;
        }
        .a .a10{
            float: left;
            margin: 30px 0px 27px;
            color: white;
            font-size: 14px;;
        }
        .a .a11{
            float: left;
            margin: 30px 0px 27px 21px;
            color: white;
            font-size: 14px;;
        }
        .a .t{
            height: 423px;
            width: 968px;
            float: left;
        }
        .a .t1{
            font-size: 26px;
            margin-top: 45px;
        }
        .a .t2{
            margin: 19px 0px 15px;
        }
        .a .t4{
            margin: 15px 0px 25px;
        }
        .a .t5{
            margin: 21px 0px 15px;
        }
        .a .t7{
            margin-top: 15px;
        }
        .a .t8{
            float: right;
        }
        .b .b1{
            float: left;
        }
        .b .b2{
            float: left;
            margin-left:65px ;
        }
        .b .b3{
            float: left;
            margin-left:92px ;
        }
        .b .b4{
            float: right;
            height: 378px;
            width: 318px;
        }
        .c .c1{
            margin-top:5px;
            float: left;
            height: 45px;
            width: 345px;
        }
        .c .c2{
            height: 19px;
            width: 165px;
            float: right;
        }
    </style>
    <body>
        <div class="a">
            <div class="a1">
            <h1>
                <a href="">
                    <img class="a2" src="images/log.png" alt="">
                </a>
            </h1>
            <ul>
                <li>
                    <a class="a3" href="">首页</a>
                </li>
                <li>
                    <a class="a4" href="">帮助与反馈</a>
                </li>
                <li>
                    <a class="a5" href="">公众平台</a>
                </li>
                <li>
                    <a class="a6" href="">开放平台</a>
                </li>
                <li>
                    <a class="a7" href="">微信支付</a>
                </li>
                <li>
                    <a class="a8" href="">微信广告</a>
                </li>
                <li>
                    <a class="a9" href="">企业微信</a>
                </li>
                <li>
                    <a class="a10" href="">表情开放平台</a>
                </li>
                <li>
                    <a class="a11" href="">微信网页版</a>
                </li>
            </ul>
            <div class="t">
                <a class="t8" href="">
                    <img src="images/com.png" alt="">
                </a>
                <h1 class="t1">微信，是一种生活方式</h1>
                <p class="t2">超过十亿人使用的手机应用</p>
                <p class="t3">支持发送语音短信、视频、图片和文字</p>
                <p class="t4">可以群聊，仅耗少量流量，适合大部分智能手机</p>
                <a href="">
                    <img src="images/down.png" alt="">
                </a>
                <p class="t5">
                    <a href="" style="color: green;">忘记了微信帐号或密码?</a>
                </p>
                <p class="t6">
                    <a href="" style="color: green;">自助解除登录或功能限制</a>
                </p>
                <p class="t7">
                    <a href="" style="color: green;">冻结或解冻微信帐号</a>
                </p>
            </div>
            </div>
        </div>
        <div class="b">
            <img src="images/list.png" alt="">
            <div class="b4">
                <ul>
                    <li>
                        <h5>最新消息</h5>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">微信 8.0.2 for Android 正式版发布(New)</a>  03-25</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">微信 3.2.1 for Windows 正式版发布 (New)</a>  03-22</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">微信 8.0.2 for iOS 正式版发布(New)</a>  02-02</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">微信 2.6.1 for Mac 正式版发布 (New)</a>  01-20</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">关于部分 iOS 9 用户无法更新微信(New)</a>  01-28</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">微信外部链接内容管理规范</a>  02-11</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">微信网页版 2.1 版本发布</a>  01-17</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">微信表情开放平台上线</a>  07-29</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">官方辟谣公众号开通</a>  10-28</p>
                        <p style="margin-top: 5px; color: grey; font-size: 12px;"><a href="" style="font-size: 14px; color: green;">查看更多</a></p>
                    </li>
                </ul>
            </div>
                <ul>
                    <li class="b1">
                        <a href=""></a>
                        <h5 style="color: black;">微信网页版</h5>
                        <p style="font-size: 14px; margin-top: 5px; color: grey;">扫一扫二维码</p>
                        <p style="font-size: 14px; margin-top: 5px; color: grey;">就能在浏览器上使用微信</p>
                        <p style="margin-top: 5px;">
                            <a href="" style="color: green;">了解更多</a>
                        </p>
                    </li>
                    <li class="b2">
                        <a href=""></a>
                        <h5 style="color: black;">微信 Mac 版</h5>
                        <p style="font-size: 14px; color: grey; margin-top: 5px;">极致简洁，迅捷沟通</p>
                        <p style="margin-top: 5px;">
                            <a href="" style="color: green;">了解更多</a>
                        </p>
                    </li>
                    <li class="b3">
                        <a href=""></a>
                        <h5 style="color: black;">微信 Windows 版</h5>
                        <p style="font-size: 14px; color: grey; margin-top: 5px;">让沟通更方便</p>
                        <p style="margin-top: 5px;">
                            <a href="" style="color: green;">了解更多</a>
                        </p>
                    </li>
                </ul>
        </div>
        <div class="c">
            <div class="c1">
                <ul>
                    <li>
                        <p style="color: grey;">
                            <a href="" style="color: grey; font-size: 12px;">关于腾讯</a> |
                            <a href="" style="color: grey; font-size: 12px;">服务条款</a> |
                            <a href="" style="color: grey; font-size: 12px;">使用规范</a> |
                            <a href="" style="color: grey; font-size: 12px;">客服中心</a> |
                            <a href="" style="color: grey; font-size: 12px;">隐私保护指引</a> 
                        </p>
                        <p style="margin-top: 5px; color: grey; font-size: 10px;">© 1998 - 2021 Tencent Inc. All Rights Reserved</p>
                    </li>
                </ul>
            </div>
            <div class="c2">
                <ul>
                    <li>
                        <p style="color: grey;">
                            <a href="" style="color: grey; font-size: 12px;">简体中文</a> |
                            <a href="" style="color: grey; font-size: 12px;">繁体中文</a> |
                            <a href="" style="color: grey; font-size: 12px;">English</a>
                        </p>
                    </li>
                </ul>
            </div>
        </div>
    </body>
</html>